<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!-- 分类首页 -->
    <title>theme</title>

    <!-- 引入bootstrap框架的样式文件 -->
    <link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.css">

    <!-- 引入导航css -->
    <link rel="stylesheet" href="../../css/forum-css/DH.css">

    <!-- 引入theme - css -->
    <link rel="stylesheet" href="../../css/forum-css/theme.css">
</head>

<body>

    <!--导航-->
    <!-- 导航中添加论坛首页 -->
    <div class="container-fluid">
        <!-- 使页面铺满整个屏幕 -->
        <div class="row">
            <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
                <div class="container-fluid">
                    <div class="navbar-brand" style="margin-left:10px">
                        <img src="../../imgs/forum-imgs/1.jpg" href="#" style="width: 50px; height:50px"></a>
                    </div>
                    <div class="navbar-brand" style="margin-left:10px">
                        <form class="form-horizontal" role="form">
                            <div class="form-group has-feedback">
                                <div class="modal-md">
                                    <span class="glyphicon glyphicon-search form-control-feedback"></span>
                                    <input id="search" type="text" class="form-control input-lg" placeholder="搜'柴犬'试试">
                                </div>
                            </div>
                        </form>
                    </div>

                    <ul class="nav navbar-nav navbar-right">
                        <li class="pure-menu-selected"><a href="../index.html" class="mynav-underline-active"><b>首页</b></a></li>
                        <li><a href="forum.html" class="nav-underline"><b>论坛</b></a></li>
                        <li><a href="#" class="nav-underline"><b>宠物动态</b></a></li>
                        <li><a href="#" class="nav-underline"><b>二手市场</b></a></li>
                        <li><a href="#" class="nav-underline"><b>趣味专区</b></a></li>
                        <li><a href="#" class="nav-underline"><b>消息中心</b></a></li>
                        <li><a href="#" class="nav-underline"><b>我的</b></a></li>

                    </ul>
                </div>
            </nav>
        </div>
    </div>

    <div id="head">
        <img src="../../imgs/forum-imgs/dog5.jpg" alt="" width="180px" height="160px"
            style="border-radius: 10%;margin: -50px 0 0 20px">
        <div style="margin:-80px 0 0 220px">
            <span style="font-size: 20px">美容吧&nbsp;&nbsp;</span>
            <button class="btn btn-warning" type="button"
                style="font-size: 12px; padding: 3px 6px; margin-top: -2px; background-color: #ff8b3d">+ 关注</button>
        </div>
        <div style="margin:20px 0 0 220px">
            <span class="glyphicon glyphicon-list-alt"> 99999&nbsp;&nbsp;</span>
            <span class="glyphicon glyphicon-comment"> 100000000</span>
        </div>
        <div style="margin:-40px 0 0 780px">
            <button class="btn btn-warning" type="button"
                style="font-size: 14px; padding: 6px 12px; margin-top: -2px;background-color: #ff8b3d">
                <span class="glyphicon glyphicon-pencil">&nbsp;</span>去发帖
            </button>
        </div>
    </div>

    <div id="neck">
        <!-- 左侧 -->
        <div id="leftNeck">
            <div style="border: 1px solid#f0f0f0; height: 60px; background-color: #fcfcfc;">
                <div style="margin:20px 0 0 20px">
                    <span class="glyphicon glyphicon-list-alt">&nbsp;最新发布&nbsp;&nbsp;</span>
                    <span class="glyphicon glyphicon-list-alt">&nbsp;精华</span>
                </div>
            </div>
            <div style="height: 40px;border: 1px solid#f0f0f0; background-color: #fcfcfc;margin-top: -1px">
                <div style="margin: 10px 0 0 20px">
                    <span style="font-size: 12px">主题分类:&nbsp;</span>
                    <span style="border: 1px solid #f0f0f0; border-radius: 40%; 
                        font-size: 12px;padding: 4px 4px; background-color: #f0f0f0">全部</span>&nbsp;&nbsp;
                    <span style="border: 1px solid #f0f0f0; border-radius: 40%; 
                        font-size: 12px;padding: 4px 4px; background-color: #f0f0f0">养宠故事</span>&nbsp;&nbsp;
                    <span style="border: 1px solid #f0f0f0; border-radius: 40%; 
                        font-size: 12px;padding: 4px 4px; background-color: #f0f0f0">经验分享</span>&nbsp;&nbsp;
                    <span style="border: 1px solid #f0f0f0; border-radius: 40%; 
                        font-size: 12px;padding: 4px 4px; background-color: #f0f0f0">咨询求助</span>&nbsp;&nbsp;
                    <span style="border: 1px solid #f0f0f0; border-radius: 40%; 
                        font-size: 12px;padding: 4px 4px; background-color: #f0f0f0">狗民讨论</span>&nbsp;&nbsp;
                </div>
            </div>
            <div style="border: 1px solid#f0f0f0; background-color: #fcfcfc;margin-top: -1px;height: 1000px;">
                <div style="height: 20px"></div>
                <div style="border: 0px; background-color: #fcfcfc;margin: 20px 20px 20px 20px">
                    <a href="../PetPerson/person.html">
                        <div style="float:left;width: 50px;">
                            <img src="../../imgs/forum-imgs/1.jpg" alt=""
                                style="width: 50px; height: 50px;border-radius: 50%">
                        </div>
                    </a>
                    <a href="post.html">
                        <div style="width: 540px;float: right;margin-top: 12px">
                            <div style="float:left;">
                                <span style="font-size: 16px">&nbsp;《论坛管理守则》</span>
                                <span id=""
                                    style="font-size: 12px;padding: 2px 4px ;border-radius: 20%; background-color: #ff8b3d; color: white">置顶</span>
                                <br>
                                <span style="font-size: 12px;color: #bebebe">&nbsp;&nbsp;哈士奇&nbsp;
                                    <span style="color:black">版主</span>
                                    &nbsp;一周前
                                </span>
                            </div>
                            <div style="float: right;font-size: 12px; margin-top: 28px;color: #bebebe">
                                <span class="glyphicon glyphicon-eye-open">&nbsp;20000</span>
                                <span class="glyphicon glyphicon-comment">&nbsp;1000</span>
                            </div>
                        </div>
                    </a>
                </div>
                <hr style="height: 1px;background-color: #e0e0e0;width: 540px;margin: 90px 0 15px 80px;">

                <div style="border: 0px; background-color: #fcfcfc;margin: 20px 20px 20px 20px">
                    <div style="float:left;width: 50px;">
                        <img src="../../imgs/forum-imgs/1.jpg" alt=""
                            style="width: 50px; height: 50px;border-radius: 50%">
                    </div>
                    <div style="width: 540px;float: right;margin-top: 12px">
                        <div style="float:left;">
                            <span style="font-size: 16px">&nbsp;《论坛管理守则》</span>
                            <span id=""
                                style="font-size: 12px;padding: 2px 4px ;border-radius: 20%; background-color: #ff8b3d; color: white">置顶</span>
                            <br>
                            <span style="font-size: 12px;color: #bebebe">&nbsp;&nbsp;哈士奇&nbsp;
                                <span style="color:black">版主</span>
                                &nbsp;一周前
                            </span>
                        </div>
                        <div style="float: right;font-size: 12px; margin-top: 28px;color: #bebebe">
                            <span class="glyphicon glyphicon-eye-open">&nbsp;20000</span>
                            <span class="glyphicon glyphicon-comment">&nbsp;1000</span>
                        </div>
                    </div>
                </div>
                <hr style="height: 1px;background-color: #e0e0e0;width: 540px;margin: 90px 0 15px 80px;">

                <div style="border: 0px; background-color: #fcfcfc;margin: 20px 20px 20px 20px">
                    <div style="float:left;width: 50px;">
                        <img src="../../imgs/forum-imgs/1.jpg" alt=""
                            style="width: 50px; height: 50px;border-radius: 50%">
                    </div>
                    <div style="width: 540px;float: right;margin-top: 12px">
                        <div style="float:left;">
                            <span style="font-size: 16px">&nbsp;哈士奇也太可爱了吧.</span>
                            <br>
                            <span style="font-size: 12px;color: #bebebe">&nbsp;&nbsp;哈士奇&nbsp;
                                <span style="color:black">版主</span>
                                &nbsp;一周前
                            </span>
                        </div>
                        <div style="float: right;font-size: 12px; margin-top: 28px;color: #bebebe">
                            <span class="glyphicon glyphicon-eye-open">&nbsp;20000</span>
                            <span class="glyphicon glyphicon-comment">&nbsp;1000</span>
                        </div>
                    </div>
                </div>
                <hr style="height: 1px;background-color: #e0e0e0;width: 540px;margin: 90px 0 15px 80px;">

                <!-- 分页 -->

                <div class="page">
                    <a href="#" class="prev">&lt;</a>
                    <a href="#" class="active">1</a>
                    <a href="#">2</a>
                    <a href="#">3</a>
                    <a href="#">4</a>
                    <a href="#">5</a>
                    <a href="#">6</a>
                    <a href="#" class="next">&gt;</a>
                </div>
            </div>

        </div>


        <!-- 右侧 -->
        <div id="rightNeck">
            <div style="margin: 20px 20px 20px 20px">
                <span>置顶</span>
                <hr style="margin: 10px 0 10px 0">
                <a href="#" style="color: black">
                    <li>哈哈哈哈哈哈</li>
                </a>
                <a href="#" style="color: black">
                    <li>嘿嘿嘿嘿嘿嘿</li>
                </a>
                <a href="#" style="color: black">
                    <li>吼吼吼吼吼吼</li>
                </a>
                <br>
                <span>版主</span>
                <hr style="margin: 10px 0 10px 0">
                &nbsp;<img src="../../imgs/forum-imgs/1.jpg" alt=""
                    style="border-radius: 50%; width: 25px; height: 25px;">
                <span>哈士奇</span>
                <br><br>
                &nbsp;<img src="../../imgs/forum-imgs/1.jpg" alt=""
                    style="border-radius: 50%; width: 25px; height: 25px;">
                <span>阿拉斯加</span>
                <br><br>
                &nbsp;<button class="btn btn-warning"
                    style="background-color: #ff8b3d">申请版主</button>&nbsp;&nbsp;&nbsp;&nbsp;
                <button class="btn btn-info" style="background-color: #46a3ff">投诉版主</button>
            </div>
        </div>
    </div>

    <div style="height: 50px; clear:both;">
        &nbsp;
    </div>
    <div style="width: 100%; background-color: #fcfcfc">
        <hr style="height: 2px;background-color: #ff8b3d;width: 100%;">
        <span style="text-align: center;margin: 0 auto">&nbsp;关于我们&nbsp;|&nbsp;联系我们&nbsp;|&nbsp;...</span>
    </div>



    <!-- bootstrap中的js插件依赖于jquery框架,所以必须先引入jquery的js文件 -->
    <script src="../../plugins/jquery/jquery.min.js"></script>
    <!--引入bootstrap的js文件-->
    <script src="../../plugins/bootstrap/js/bootstrap.js"></script>
    <!-- 引入导航js -->
    <script src="../../js/forum-js/DH.js"></script>
</body>

</html>